<template>
    <!-- 添加学科对话框 -->
    <div class='container'>
        <el-dialog :title="node.id ? '修改学科' : '新增学科'" :visible="showDialog" @close="btnCancel" width="26%">
            <el-form label-width="80px" :rules="rules" ref="addFormData" :model="addFormData">
                <el-form-item label="学科名称" prop="subjectName">
                    <el-input v-model="addFormData.subjectName" placeholder="请输入学科名称"></el-input>
                </el-form-item>
                <el-form-item style="width:100%" label="是否显示" prop="isFrontDisplay">
                    <template v-slot="{ row }">
                        <!-- active-value 打开  inactive-value  关闭 -->
                        <!-- :value="Number(row.enableState)" -->
                        <el-switch v-model="addFormData.isFrontDisplay" :active-value="1" :inactive-value="0"
                            active-color="#13ce66" inactive-color="#ff4949" />
                    </template>
                </el-form-item>
            </el-form>
            <el-row slot="footer" type="flex" justify="end">
                <el-button @click="btnCancel">取消</el-button>
                <el-button type="primary" @click="btnOK">确认</el-button>
            </el-row>
        </el-dialog>
    </div>
</template>

<script>
import { add, update, detail } from '@/api/hmmm/subjects.js'
export default {
    props: {
        showDialog: {
            type: Boolean,
            require: true,
            default: false
        },

        // addFormData: Object
    },
    data() {
        return {
            node: {},
            addFormData: {
                subjectName: '',
                isFrontDisplay: null
            },
            rules: {
                subjectName: [{ required: true, message: '请输入学科名称！！！', trigger: 'blur' }],
            }
        }
    },
    created() {
    },
    methods: {
        async detail(node) {
            let { data } = await detail(node)
            this.node = node
            // console.log(data);
            this.addFormData.subjectName = data.subjectName
            this.addFormData.isFrontDisplay = data.isFrontDisplay
        },
        async btnOK() {
            try {
                await this.$refs.addFormData.validate()

                if (this.node.id) {
                    await update({ id: this.node.id, ...this.addFormData })
                } else {
                    await add(this.addFormData)

                }

                this.$emit('updateForm')
                this.$emit('update:show-dialog', false)
                this.$message.success(this.node.id ? '修改学科成功啦!' : '新增学科成功啦!')
            } catch (error) {
                console.log(error)
            }
        },
        btnCancel() {
            // 重置原来的数据
            this.addFormData = {
                subjectName: '',
                isFrontDisplay: 1
            },
                this.node = {}
            this.$refs.addFormData.resetFields() // 重置校验结果
            this.$emit('update:show-dialog', false)
        }
    },
}
</script>

<style scoped lang='less'></style>
